<template>
  <div class="content">
   <header class="bar bar-nav" >
    <a class="button button-link button-nav pull-left" v-link="{path: '/home', replace: false}">
    <span class="icon icon-left"></span>
    </a>
    <h1 class="title">近期活动</h1>
  </header>
<div class="content">
  <ul >
  <li v-for="item in travels">
    <div class="card">
      <div class="card-header">{{item.title}}</div>
      <div class="card-content">
      <div class="card-content-inner">
      <div><span class="icon icon-star" style="padding:10px;"></span>活动时间: {{item.datetime}}</div>
      <div><span class="icon icon-star" style="padding:10px;"></span>活动地点:</div>
      <div><span class="icon icon-star" style="padding:10px;"></span>报名要求: ￥{{item.money}} </div>
      <div>
       <span class="icon icon-star" style="padding:10px;"></span>内容：
       <div>{{{item.content}}}</div>
      </div>
      </div>
      </div>
      <div class="card-footer">
       <a class='button button-big button-success button-fill'  v-link="{path: '/travel/baoming1'}" @click="setTravel(item.title,item.datetime,item.money,item.id)" >活动在线报名</a>
      </div>
   </div>
  </li>
 </ul>
</div>
</template>
<script>
import Slider from '../components/Slider'
import Bar from '../components/Bar'
import BarItem from '../components/BarItem'
import VLayer from '../components/PullToRefreshLayer'
import VCardContainer from '../components/Card'
import Btn from '../components/Button'
import Card from '../components/CardItem'
import VContent from '../components/Content'
import List from '../components/List'
import Item from '../components/ListItem'
import $ from 'zepto'
export default {
  route: {
    data () {
      this.$http.get(this.apiUrl)
      .then(function(response) {
        this.$set('travels', response.json().travels)
        $.hidePreloader()
      })
      $.showPreloader()
      this.$set('code', this.$route.query.code)
      console.log(this.code)
      this.$http.get(this.apiUrl2 + this.code).
      then(function(response) {
        this.$set('user', response.json().user)
        $.sign.uid = this.user.uid
        console.log($.sign.uid)
        $.sign.openid = this.user.openid
        console.log($.sign.openid)
        this.$set('code', '')
        $.user = this.user
      })
    }
  },
  ready () {
    $.init()
    window.onload = function() {
      console.log('window...')
      $('img').each(function(index) {
        console.log(index)
      })
    }
  },
  data () {
    return {
      travels: [],
      apiUrl: 'http://creatgo.com/oec/travel?method=travel-phone',
      code: '',
      apiUrl2: 'http://creatgo.com/oec/login?method=login-wx&code=',
      user: {
        uid: '',
        openid: '',
        type: 0,
        assistid: '',
        phone: '',
        email: '',
        school: '',
        grade: '',
        major: '',
        address: '',
        name: '',
        img: '',
        nickname: ''
      }
    }
  },
  methods: {
    setTravel: function (name, datetime, money, id) {
      console.log('test/.....')
      console.log(name)
      console.log(datetime)
      console.log(money)
      $.travel.name = name
      $.travel.datetime = datetime
      $.travel.money = money
      $.travel.id = id
      console.log($.travel.name)
      console.log($.travel.datetime)
      console.log($.travel.money)
      console.log($.travel.id)
    }
  },
  computed: {
    length () {
      return this.tasks.length
    }
  },
  components: {
    Slider,
    Bar,
    BarItem,
    VLayer,
    VCardContainer,
    Card,
    VContent,
    List,
    Item,
    Btn
  }
}
</script>

<style>
.card-header{
 text-align:center;
 color:black;
}

ul{
 padding:0px;
}
li{
 list-style:none;
}
img{
 width:100%;
}
</style>
